// mela onlie 购物车界面 订制
import { PureComponent } from "react";
import { Button, Modal,DatePicker, List,Checkbox,Tabs } from "antd-mobile"
import { connect } from 'dva';
import { InputItem } from 'antd-mobile';
import { handleImg, isNull, backToPrevious,goToPage,handleOSS } from "../../utils/helper";
import MToast from '../../components/Util/MToast';
import { routerRedux } from "dva/router";
import {IntlProvider, addLocaleData,FormattedMessage} from 'react-intl';
import localeData from '../../../public/lang/data.json';
import "./PlaceOrder.less";
const nowTimeStamp = Date.now();

const now = new Date(nowTimeStamp);
@connect(() => {
  return ({

  })
})
export default class CustomerDetail extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      date: now,
      greenCode:'',//输入的绿卡号
      cusName:'',//客户名称
      customer_rate_code:'',//税号
      birthday:'',//生日
      contact_way:'',//联系电话
      email:'',//邮箱
      checked:false,
      sureCode:false,//验证绿卡号
      sales_code:'',
      electronic_invoice_code:'',//电子发票接收代码
      registered_city:"",//城市编码
      registered_area:"",//行政区
      registered_country:"IT",//国家
      registered_street:"",//街道
      pec_email:"",//认证邮箱
      customer_rate_code:"",//税号
      contact:"",//联系人
      salesType:'',
      privacyModal:false,
      indexTitle:0
    }
  }
  componentWillMount() {
    let { dispatch, location } = this.props;
    dispatch({
      type: "global/setHeaderTitle",
      payload: {
        title: "",
        path: location.pathname + location.search
      }
    });
    // let old_cart_address = localStorage.getItem(MI_APP_CODE + "old_cart_address");
    // if (!isNull(old_cart_address)) {
    //   localStorage.removeItem(MI_APP_CODE + "old_cart_address");
    //   old_cart_address = JSON.parse(old_cart_address);
    //   for (let i in old_cart_address) {
    //     this.setState({
    //       [i]: old_cart_address[i]
    //     })
    //   }
    // }

  }

  componentDidMount() {
    let { dispatch } = this.props;
    dispatch({
      type: "form/query",
      payload: {
        apiInfo: {
          url: "/qry/all?_c=customer_detail",
          params: [
            {
              key: "name",
              value:localStorage[MI_APP_CODE + "bindName"]
            },

          ],
          _c: "customer_detail"
        },
        callback: (result) => {
          let { data,code } = result;
          if (code == 10200) {
            var date = new Date(data.birthday);

             const formatTime=date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
             let {birthday,
               code,
            contact,
            contact_way,
            customer_greencard,
            customer_rate_code,
            electronic_invoice_code,
            email,
            full_address,
            name,
            pec_email,
            registered_area,
            registered_city,
            registered_country,
            registered_street,
            sales_type} = data[0]
            this.setState({
              greenCode:customer_greencard,
              salesType:sales_type,
              cusName:name,
              customer_rate_code:customer_rate_code,
              birthday:formatTime,
              contact_way:contact_way,//联系电话
              email:email,//邮箱
              electronic_invoice_code:electronic_invoice_code,
              registered_city:registered_city,
              registered_area:registered_area,
              registered_country:registered_country,
              pec_email:pec_email,
              registered_street:registered_street
            })
            // console.log("登陆成功");
            console.log(data[0])
          }
          else if (code == 10303) {
            // console.log("手机格式错误");
            MToast.info(localeData[localStorage.locale].newLoginTitle8)
          }
          else{

          }
        }
      }
    });
  }

  retailSureClick = () => {
    let { greenCode,cusName, customer_rate_code, birthday,contact_way,
      email,date,sureCode,sales_type,electronic_invoice_code,
      registered_city,registered_area,registered_country,pec_email,contact,salesType, registered_street } = this.state;
    let { dispatch } = this.props;
    if(salesType=='T1'){
      if (isNull(greenCode)) {
        MToast.fail(T(localeData[localStorage.locale].greenCodeTitle1), 3, null, false);
        return;
      }
      if(!sureCode){
        MToast.fail(T(localeData[localStorage.locale].retailTitle1), 3, null, false);
        return;
      }
      if (isNull(cusName)) {
        MToast.fail(T(localeData[localStorage.locale].retailTitle3), 3, null, false);
        return;
      }
      if (!this.state.checked){
        MToast.fail(localeData[localStorage.locale].retailTitle21, 3, null, false);
        return;
      }
      dispatch({
        type: "form/query",
        payload: {
          apiInfo: {
            url: "/ent/create?_c=customer_bind",
            params: [
              {
                key: "sales_type",
                value: 1
              },
              {
                key: "customer_greencard",
                value: greenCode
              },
              {
                key: "name",
                value: cusName
              },
              {
                key: "customer_rate_code",
                value: customer_rate_code?customer_rate_code:' '
              },
              {
                key: "birthday",
                value: date?date:' '
              },
              {
                key: "contact_way",
                value: contact_way?contact_way:' '
              },
              {
                key: "email",
                value: email?email:" "
              },
            ],
            _c: "customer_bind"
          },
          callback: (result) => {
            let { data,code } = result;
            if(code==10200){
              // localStorage[MI_APP_CODE + "bindName"] = data.bind_name;
              goToPage({ dispatch, config: { url: "/my" }, })
            }
          }
        }
      })
    }
    else{
      if (isNull(greenCode)) {
        MToast.fail(T(localeData[localStorage.locale].greenCodeTitle1), 3, null, false);
        return;
      }
      if(!sureCode){
        MToast.fail(T(localeData[localStorage.locale].retailTitle1), 3, null, false);
        return;
      }
      if (isNull(cusName)) {
        MToast.fail(T(localeData[localStorage.locale].retailTitle3), 3, null, false);
        return;
      }
      if (!this.state.checked){
        MToast.fail(T(localeData[localStorage.locale].retailTitle23), 3, null, false);
        return;
      }
      if (isNull(electronic_invoice_code)) {
        MToast.fail(T(localeData[localStorage.locale].retailTitle10), 3, null, false);
        return;
      }
      if (isNull(registered_city)) {
        MToast.fail(T(localeData[localStorage.locale].retailTitle12), 3, null, false);
        return;
      }
      if (isNull(registered_area)) {
        MToast.fail(T(localeData[localStorage.locale].retailTitle13), 3, null, false);
        return;
      }
      if (isNull(registered_country)) {
        MToast.fail(T(localeData[localStorage.locale].retailTitle14), 3, null, false);
        return;
      }
      if (isNull(pec_email)) {
        MToast.fail(T(localeData[localStorage.locale].retailTitle15), 3, null, false);
        return;
      }
      // if (isNull(customer_rate_code)) {
      //   MToast.fail(T("请输入税号"), 3, null, false);
      //   return;
      // }
      // if (isNull(contact_way)) {
      //   MToast.fail(T("请输入联系方式"), 3, null, false);
      //   return;
      // }
      // if (isNull(contact)) {
      //   MToast.fail(T("请输入联系人"), 3, null, false);
      //   return;
      // }
      dispatch({
        type: "form/query",
        payload: {
          apiInfo: {
            url: "/ent/create?_c=customer_bind",
            params: [
              {
                key: "sales_type",
                value: 0
              },
              {
                key: "customer_greencard",
                value: greenCode
              },
              {
                key: "name",
                value: cusName
              },
              {
                key: "customer_rate_code",
                value: customer_rate_code?customer_rate_code:' '
              },
              {
                key: "electronic_invoice_code",
                value: electronic_invoice_code
              },
              {
                key: "contact_way",
                value: contact_way?contact_way:' '
              },
              {
                key: "registered_city",
                value: registered_city
              },
              {
                key: "registered_area",
                value: registered_area
              },
              {
                key: "registered_country",
                value: "IT"
              },
              {
                key: "registered_street",
                value:registered_street?registered_street:''
              },

              {
                key: "pec_email",
                value: pec_email
              },
              {
                key: "contact",
                value: contact?contact:' '
              },
            ],
            _c: "customer_bind"
          },
          callback: (result) => {
            let { data,code } = result;
            if(code==10200){
              // localStorage[MI_APP_CODE + "bindName"] = data.bind_name;
              goToPage({ dispatch, config: { url: "/my" }, })
            }else{

            }

          }
        }
      })
    }


    // backToPrevious();
    // goToPage({ dispatch, config: { url: "/placeOrder" }, isReplace: false })
  }
  handleGreen=(value)=>{
    this.setState({
      greenCode:value
    })

  }
  greenClick=()=>{
    let { dispatch, location } = this.props;
    dispatch({
      type: "login/selectGreenCode",
      payload: {
        "customer_greencard":this.state.greenCode,
        "phone": localStorage[MI_APP_CODE + "phone"],
        callback: (result) => {
          let { data,code } = result;
          if (code == 10200) {
            // console.log("登陆成功");
            console.log(result)
           MToast.success(localeData[localStorage.locale].retailTitle21, 0.8);
            this.setState({
              sureCode:true,
              // customer_greencard:data.customer_greencard,
              // bindName:data.bind_name,
              // customer_id:data.customer_id,
              // phone:data.phone,
              // sales_type:data.sales_type

            })

          }else if(code == 10324){
            MToast.info(localeData[localStorage.locale].retailTitle20, 0.8);

          }
          // else if(code == 10345){
          //   MToast.info("绿卡号已绑定其他账号", 0.8);
          //
          // }
          // else if(code == 10803){
          //   MToast.info("验证码已失效", 0.8);
          //
          // }
          else{

          }
        }
      }
    });
  }
  onChangeBox=(e)=>{
    this.setState({
      checked:e.target.checked
    })
  }
  privacyCusClick=()=>{
    // let {dispatch}=this.props;
    // dispatch(routerRedux.push("/privacycus"))
    this.setState({
      privacyModal:true
    })
  }
  onClose = key => () => {
    this.setState({
      [key]: false,
    });
  }
  render() {
    let { greenCode,cusName, customer_rate_code, birthday,contact_way,email,date,sales_type,electronic_invoice_code,registered_city,
      registered_area,
      registered_country,
      pec_email,
      contact,salesType ,indexTitle,registered_street} = this.state;
    const messages = localeData[localStorage.locale];
    const tabs = [

      { title: <div><img src="image/Italy.png" style={{marginRight:'20px'}}/>IT</div>,sub:'0' },
      { title: <div><img src="image/china.png" style={{marginRight:'20px'}}/>中文</div>,sub:'1' },
    ];
    console.log(salesType)
    return (
      <IntlProvider
        locale={ localStorage.locale } messages={messages}
      >
      <div className="normal" style={{ background: "#fff", height: "100%" }}>

        <div style={{padding:'4% 24px 40px'}}>
          {salesType=='1'?<div>
            <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.greenCodeTitle}</p>
            <div style={{borderBottom:'1px solid #DDE3F1',overflow:'hidden'}}>
              <div  style={{width:'76%',float:"left"}}>
                <InputItem
                  clear
                  placeholder={messages.greenCodeTitle1}
                  value={greenCode}
                  disabled
                ></InputItem>
              </div>

            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle2}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle3}
                  value={cusName}
                 dispblea
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle4}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle5}
                  value={customer_rate_code}
                 disabled
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle6}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle6}
                  value={birthday}
                  disabled
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle7}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem
                  maxLength="11"
                  disabled
                  placeholder={messages.retailTitle71}
                  value={contact_way}
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle8}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle9}
                  value={email}
                 disabled
                ></InputItem>
              </div>
            </div>
          </div>:<div>
            <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.greenCodeTitle}</p>
            <div style={{borderBottom:'1px solid #DDE3F1',overflow:'hidden'}}>
              <div  style={{width:'76%',float:"left"}}>
                <InputItem
                  clear
                  placeholder={messages.greenCodeTitle1}
                  value={greenCode}
                 disabled

                ></InputItem>
              </div>


            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle2}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle3}
                  value={cusName}
                  disabled
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle10}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle11}
                  value={electronic_invoice_code}
                  disabled
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle12}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle12}
                  value={registered_city}
                 disabled
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle13}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem
                  disabled
                  clear
                  placeholder={messages.retailTitle13}
                  value={registered_area}

                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle14}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem
                 disabled
                  clear
                  placeholder={messages.retailTitle14}
                  value={registered_country}

                ></InputItem>
              </div>
            </div>

            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle15}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle16}
                  value={pec_email}
                  disabled
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle4}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem

                  clear
                  placeholder={messages.retailTitle5}
                  value={customer_rate_code}
                 disabled
                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle141}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem
                 disabled
                  clear
                  placeholder={messages.retailTitle141}
                  value={registered_street}

                ></InputItem>
              </div>
            </div>
            <div style={{padding:'16px 0px 0px'}}>
              <p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>{messages.retailTitle7}</p>
              <div style={{borderBottom:'1px solid #DDE3F1'}}>
                <InputItem
                  maxLength="11"
                 disabled
                  clear
                  placeholder={messages.retailTitle71}
                  value={contact_way}

                ></InputItem>
              </div>
            </div>
            {/*<div style={{padding:'16px 0px 0px'}}>*/}
              {/*<p style={{color:'#303133',fontSize:'13px',fontWeight:'bold',marginBottom:'6px'}}>联系人</p>*/}
              {/*<div style={{borderBottom:'1px solid #DDE3F1'}}>*/}
                {/*<InputItem*/}

                  {/*clear*/}
                  {/*placeholder="联系人"*/}
                  {/*value={contact}*/}
                  {/*onChange={(e) => {*/}
                    {/*this.setState({*/}
                      {/*contact: e*/}
                    {/*})*/}
                  {/*}}*/}
                {/*></InputItem>*/}
              {/*</div>*/}
            {/*</div>*/}
          </div>}


        </div>
      </div >
      </IntlProvider>
    )
  }
}
